<template>
  <div>
  <reg class="regf" v-on:surePwd="surePwd" v-on:sureusername="sureusername" v-on:sureCheckedPwd="sureCheckedPwd"></reg>
  <button class="btn-next" @click="next">下一步</button>
  </div>
</template>

<script>
  import reg from './regform'
  import bus from '../../assets/bus'
  import {mapMutations} from 'vuex'
    export default {
        name: "stepone",
      data(){
          return{
            user:null,
            pwd:null,
            username:null,
            password:null,
              checkedpwd:null,
              checkedPassword:null,
          }
      },
      components:{
          reg
      },
      methods:{
          ...mapMutations(['setUser']),
          next:function () {
            var _this=this;
            // console.log(_this.pwd);
            if((_this.user==1)&&(_this.pwd==1)) {
              this.$parent.next();
              // this.$nextTick(function () {
              //   bus.$emit('ep', [_this.username,_this.password,_this.checkedPassword])//向steptwo组件广播此组件获取的用户信息
              // })
                let user={
                    username:_this.username,
                    password:_this.password,
                    checkedPassword:_this.checkedPassword
                };
                _this.setUser(user);
                console.log(_this.$store.state)
              this.$router.push("/reg/steptwo");
            }
            else {
              _this.$message({
                message: '请输入正确的信息',
                type: 'error'
              })
            }
          },
          //接收子组件传来的username、passward信息
        sureusername:function (val) {
          this.user=val[0];//确认此项已经填写正确
          this.username=val[1];
        },
        surePwd:function (val) {
          this.pwd=val[0];//确认此项已经填写正确
          this.password=val[1];
        },
          sureCheckedPwd:function (val) {
              this.checkedpwd=val[0];
              this.checkedPassword=val[1];
          }
      }
    }
</script>

<style scoped>
  .regf{
    margin: 0 auto;
    width: 500px;
    margin-left: -64px;
    margin-top: 50px;
  }
  .btn-next{
    margin: 0 auto;
    width: 380px;
    margin-top: 50px;
    margin-left: -5px;
    height: 46px;
    background: #2c82ff;
    color: #FFFFFF;
    outline: none;
    border: none;
    cursor: pointer;
    font-weight: bold;
    font-size: 20px;
    font-family: 'Microsoft Yahei', 微软雅黑, Arial, simsun;

  }
  .btn-next:hover{
    opacity: 0.5;
  }
</style>
